<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { useRoute } from 'vue-router';
import CompetitionHeader from '#/components/common/competition-header.vue';
import Footer from "#/components/common/footer.vue";
import CertificateFooter from '#/components/certificate-home/footer.vue';
import { getCompetitionBasicInfoApi } from '#/api/competition/lives';

defineOptions({ name: "CompetitionHome" })

const route = useRoute();
const pageFooterData = ref<any>(null);

// 获取大赛基本信息
const getCompetitionBasicInfo = () => {
  if (!route.query.matchId) {
    return;
  }
  getCompetitionBasicInfoApi({ matchId: route.query.matchId as string }).then((response) => {
    console.log('大赛基本信息:', response);
    if (response) {
      pageFooterData.value = response.footer || {
        provideContent: '课程合作、考试认证、用户服务等，可以通过官方邮箱/电话联系我们！',
        phone: '17689898989',
        email: 'kikili@sell.com',
        publicAccount: {
          code: response.cover,
          desc: '微信公众号'
        },
        service: {
          code: response.cover,
          desc: '客服微信'
        }
      };
    }
  }).catch((error) => {
    console.error('获取大赛基本信息失败:', error);
  });
};

onMounted(() => {
  getCompetitionBasicInfo();
});

</script>
<template>
  <div class="min-h-screen flex flex-col relative bg-gray-50">
    <CompetitionHeader></CompetitionHeader>
    <RouterView class="flex-auto" v-slot="{ Component }">
      <component :is="Component"></component>
    </RouterView>

    <!-- 动态页脚 - 位于原有Footer之上 -->
    <CertificateFooter v-if="pageFooterData" :footer="pageFooterData"></CertificateFooter>
    <Footer></Footer>
  </div>
</template>
<style lang="less" scoped></style>
